<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection" />
    <meta content="emai=no" name="format-detection" />
    <meta property="wb:webmaster" content="7ae117dc1d8992dc" />
    <link rel="stylesheet" type="text/css" href="/css/common.css" />
    <link rel="stylesheet" type="text/css" href="/css/form.css" />
    <title>绑定样本</title>
    <style>
        form label {
            width: 20%;
        }

        .btn-scan {
            background-color: #ffee71;
            -moz-background-clip: padding-box;
            -webkit-background-clip: padding-box;
            background-clip: padding-box;
            border: 1px solid #232323;
            -moz-border-radius: 20px;
            -webkit-border-radius: 20px;
            border-radius: 20px;
            color: #232323;
            display: block;
            margin: 10px auto 0 auto;
            font-size: 1.4rem;
            padding: 8px 15px;
            width: 80px;
            text-align: center;
        }
    </style>
</head>
<body>
    <div class="wrapper">
        <form method="post" action="">
        	<section>
            <ul id="form1">
            	<li class="flex-wrapper">
                        <label>产品</label>
                        <label class="flex-1">
                            	商品名称
                        </label>
                </li>
                <li class="flex-wrapper">
                    <label>样本ID</label>
                    <p class="flex-1">
                        <input type="text" name="bind_no[]" id="form-codeid" value="" data-message="样本ID不能为空" />
                        <span id="btn-scan" class="btn-scan">扫一扫</span>
                    </p>
                </li>
                <li class="flex-wrapper flex-align-center">
                    <label>姓名</label>
                    <p class="flex-1">
                        <input type="text" id="form-name" name="name[]" value="" data-message="姓名不能为空" />
                    </p>
                </li>
                <li class="flex-wrapper flex-align-center">
                    <label>性别</label>
                    <p class="flex-1">
                        <input type="radio" id="form-sex_male" name="gender" value="1" checked="checked" />
                        <label name="sex[]" class="" for="sex_male">男</label>
                        <input type="radio" id="form-sex_female" name="gender" value="2" />
                        <label name="sex[]" class="checked" for="sex_female">女</label>
                    </p>
                </li>
                <li class="flex-wrapper flex-align-center">
                    <label>手机</label>
                    <p class="flex-1">
                        <input type="tel" id="form-telephone" name="mobile[]" value="" data-message="手机不能为空" />
                    </p>
                </li>
            </ul>
            </section>
        </form>
    </div>
    <script src="/js/zepto-1.1.6.js" type="text/javascript"></script>
    <script src="/js/common.js" type="text/javascript"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script>
        Zepto(function ($) {
            wx.config({
                debug: true,
                appId: '<?php echo $js_config['appId']?>',
                timestamp: <?php echo $js_config['timestamp']?>,
                nonceStr: '<?php echo $js_config['noncestr']?>',
                signature: '<?php echo $js_config['signature']?>',
                jsApiList: [
                	'scanQRCode'
                ]
            });
            wx.ready(function () {
                // 扫描二维码并返回结果
                $('#btn-scan').click(function (e) {
                    wx.scanQRCode({
                        needResult: 1,
                        desc: '扫描样本ID',
                        success: function (res) {
                            var arr = res.resultStr.split(",");
                            var content = arr.pop();
                            $("#form-codeid").val(content);
                        }
                    });
                });
            });
            
        });
    </script>
</body>
</html>
